﻿@{
    Layout = null;
}
<!DOCTYPE html> 
<html>
    <head>
        <title>@Language.Get("注册")</title>
       @Html.Partial("commonMeta")
    </head>
    <body>
    	<div class="views">
			<div class="view view-main">
				<div class="navbar">
					<div class="navbar-inner">
			            <header id="common_header">
			                <a class="menu_icon_box" href="javascript:history.go(-1);">
								<b class="back-btn"></b>
							</a>
			                <h2>@Language.Get("注册")</h2>
			            </header>
					</div>
			    </div> 
				<div class="pages navbar-through toolbar-through">
		          	<div data-page="index" class="page">
						<div class="page-content" id="app_no_header">
							<!--内容区start-->
							
                			 <article>
             <ul id="regis-data" class="layout-box regis-box">
                 <li>
                     <em class="user-icon"></em>
                     <input type="text" id="userName" class="input-box" placeholder="@Language.Get("请输入登录名")" required="required" autofocus="autofocus"/>
                     <span class="u-error"></span>
                 </li>
                  <li>
                     <em class="pwd-icon"></em>
                     <input type="password" id="userPwd" class="input-box" placeholder="@Language.Get("请输入密码")" required="required" autofocus="autofocus" />
                      <span class="pwd-error"></span>
                 </li>
                <li>
                     <em class="phone-icon"></em>
                     <input type="tel" class="input-box" id="mobile" required="required" autofocus="autofocus" placeholder="@Language.Get("请输入手机号")" maxlength="11"/>
                    <span class="m-error"></span>
                 </li>
                 <li>
                     <em class="user-icon"></em>
                     <input type="text" id="nickName" class="input-box" placeholder="@Language.Get("请输入昵称")" required="required" autofocus="autofocus" />
                     <span class="nick-error"></span>
                 </li>
             </ul>
               <a class="sure-btn regis-btn">@Language.Get("注册")</a>
             <div class="link-box">
                 <a href="/customer/index" class="link-right"><b>@Language.Get("已经注册？")</b>@Language.Get("登录")</a>
             </div>
             <div class="tip-box regis-tip-box">
                 <div class="tip regis-tip">
                     <p class="msg regis-msg"></p>
                     <span class="colse-tip-btn">@Language.Get("确定")</span>
                 </div>
             </div>
             <div class="tip-box regis-success-box">
                 <div class="tip success-rgistip">
                     <p class="msg success-msg">@Language.Get("感谢您的注册,我们的团队会尽快与您取得联系!")</p>
                     <span class="colse-tip-btn go-login">@Language.Get("去登录")</span>
                 </div>
             </div>
         </article>
        
		                
		                <!--内容区end-->
		                
        			 </div>
		       		</div>
		       </div>
			</div>
		</div>

        </body>
    </html>
   <script src="~/Js/jquery.min.js"></script>
   <script type="text/javascript" src="~/Js/framework/framework7.js"></script>
        <script>
            $(function () {
                var username = $("#userName").val();//获取用户名
                var pwd = $("#userPwd").val();//获取密码
                var mobile = $("#mobile").val();//获取手机号
                var nickname = $("#nickName").val();//获取昵称

                //名字的校验start
                $("#userName").blur(function () {
                    nameIsExit();
                });
                var isname = false;
                //校验名字是否已被注册
                function nameIsExit() {
                    if ($("#userName").val() == "") {//为空的话
                        $(".u-error").html("<font color='red'>*</font>");
                        isname = false;
                    } else {
                        $.ajax({
                            url: "/Customer/CustomerRegIsExist",//提交地址
                            type: "POST",//提交方式
                            data: "{'UserName':'" + $("#userName").val() + "'}",
                            async: false,
                            contentType: "application/json; charset=utf-8",
                            success: function (result) {
                                var _result = eval('(' + result + ')');//eval()解析单个json对象                    
                                if (_result['msgcode'] == false) {//已被注册
                                    $(".u-error").html("<font color='red'>"+_("已注册")+"</font>");
                                    isname = false;//名字的变量为false
                                } else {//未被注册
                                    $(".u-error").html("<font color='red'></font>");
                                    isname = true;
                                }
                            },
                            error: function (err) {
                                alert("err:" + _(err));
                            }
                        });
                    }
                }
                //名字的校验end


                //手机号的验证和未被注册start
                $("#mobile").blur(function () {
                    phoneIsExit();
                });
                var isphone = false;
                function phoneIsExit() {
                    if ($("#mobile").val() == "") {
                        $(".m-error").html("<font color='red'>*</font>");
                        isphone = false;
                    }
                    if (!$("#mobile").val().match(/^(((13[0-9]{1})|159|153)+\d{8})$/)) {
                        $(".m-error").html("<font color='red'>"+_("不合法")+"</font>");
                        isphone = false;
                    } else {
                        $.ajax({
                            url: "/Customer/CustomerRegIsExist",//提交地址
                            type: "POST",//提交方式
                            data: "{'Mobile':'" + $("#mobile").val() + "'}",
                            async: false,
                            contentType: "application/json; charset=utf-8",
                            success: function (result) {
                                var _result = eval('(' + result + ')');//eval()解析单个json对象                    
                                if (_result['msgcode'] == false) {
                                    $(".m-error").html("<font color='red'>"+_("已注册")+"</font>");
                                    isphone = false;
                                } else {
                                    $(".m-error").html("<font color='red'></font>");
                                    isphone = true;
                                }
                            },
                            error: function (err) {
                                alert("err:" + _(err));
                            }
                        });
                    }
                }
                //手机号的验证和未被注册end

                //密码验证start
                $("#userPwd").blur(function () {
                    isPwd();
                });
                var ispwd = false;
                function isPwd() {
                    if ($("#userPwd").val() == "") {
                        $(".pwd-error").html("<font color='red'>*</font>");
                        ispwd = false;
                    } else {
                        ispwd = true;
                        $(".pwd-error").html("<font color='red'></font>");
                    }
                }
                //密码验证end

                //昵称验证start
                $("#nickName").blur(function () {
                    isNick();
                });
                var isnick = false;
                function isNick() {
                    if ($("#nickName").val() == "") {
                        $(".nick-error").html("<font color='red'>*</font>");
                        isnick = false;
                    } else {
                        isnick = true;
                        $(".nick-error").html("<font color='red'></font>");
                    }
                }
                //昵称验证end

                    //点击注册按钮
                    $(".regis-btn").click(function () {
                        if (isname && isphone && isnick && ispwd) {//用户名、手机号、昵称和密码验证通过
                                CustomerRegister();//注册方法
                            }
                        else {
                            $(".regis-tip-box").show();//弹出提示
                            $(".regis-msg").html(_("请正确填写资料"));
                        }
                    });

                    //关闭登录错误提示按钮
                    $(".colse-tip-btn").click(function () {
                        $(".regis-tip-box").hide();
                    });
                    $(".go-login").click(function () {
                        window.location.href = "/customer/index";
                    });
                });
           //用户注册的方法
                    function CustomerRegister() {
                        var requestCustomer = {};
                        requestCustomer.UserName = $("#userName").val(); //
                        requestCustomer.UserPassword = $("#userPwd").val();
                        requestCustomer.Mobile = $("#mobile").val();
                        requestCustomer.NickName = $("#nickName").val();
                        $.ajax({
                            url: "/Customer/CustomerRegister",//提交地址
                            type: "POST",//提交方式
                            data: JSON.stringify(requestCustomer),
                            contentType: "application/json; charset=utf-8",
                            success: function (result) {
                                var _result = eval('(' + result + ')');//eval()解析单个json对象
                                //$(".register_form input[type=reset]").trigger("click");//清空form数据 8-30 关键 一定要放最前面
                                if (_result['msgcode'] == false) {
                                    $(".regis-tip-box").show();//弹出提示
                                    $(".regis-msg").html(_(_result['msginfo']));
                                } else {
                                    $(".regis-success-box").show();
                                  
                                }
                            }
                        });
                    }
        </script>